<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="layui/css/layui.css">
        <link rel="stylesheet" media="screen" href="css/login.css">
        <style type="text/css">
              .container{
                  width: 420px;
                  height: 320px;
                  min-height: 320px;  
                  max-height: 320px;  
                  position: absolute;   
                  top: 0;  
                  left: 0;  
                  bottom: 0;  
                  right: 0;  
                  margin: auto;  
                  padding: 20px;  
                  z-index: 130;  
                  border-radius: 8px;  
                  background-color: #fff;  
                  box-shadow: 0 3px 18px rgba(100, 0, 0, .5); 
                  font-size: 16px;
              }
              .close{
                  background-color: white;
                  border: none;
                  font-size: 18px;
                  margin-left: 410px;
                  margin-top: -10px;
              }
 
            .layui-input{
                border-radius: 5px;
                width: 300px;
                height: 40px;
                font-size: 15px;
            }
            .layui-form-item{
                margin-left: -20px;
            }
            #logoid{ 
                margin-top: -16px;
                  padding-left:150px; 
                  padding-bottom: 15px;
            }
            .layui-btn{
                margin-left: -50px;
                border-radius: 5px;
                width: 350px;
                height: 40px;
                font-size: 15px;
            }
            .verity{
                width: 120px;
            }
            .font-set{
                font-size: 13px;
                text-decoration: none; 
                margin-left: 120px;
            }
            a:hover{
             text-decoration: underline; 
            }
            .login_1{
                position: relative;
                left:170px;
                font-size: 25px;
            }
 
        </style>
    </head>
    <body style="overflow:hidden;background:#000">
    	<div id="particles-js" style="display: flex;align-items: center;justify-content: center">
			<canvas class="particles-js-canvas-el" style="width: 100%; height: 100%;" width="472" height="625"></canvas>
		</div>
    	<!-- <canvas id="container"></canvas> -->
        <form class="layui-form" action="" method="post">
            <div class="container">
                <button class="close" title="关闭">X</button>
                <div class="layui-form-mid layui-word-aux">
                    <!--<img id="logoid" src="06.png" height="35">-->  
                    <p class='login_1'>用户注册</p><br>          
                </div>
              <div class="layui-form-item">
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-block">
                  <input id='num' type="text" name="title" required  lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
                </div>
              </div>
              <div class="layui-form-item">
                <label class="layui-form-label">密码</label>
                <div class="layui-input-inline">
                  <input id='pswd' type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
                </div>
                <!-- <div class="layui-form-mid layui-word-aux">辅助文字</div> -->
              </div>
               <div class="layui-form-item">
                    <br>
                <div class="layui-input-inline">
                  
                </div>
                <!-- <div class="layui-form-mid layui-word-aux">辅助文字</div> -->
                  
              </div>
 
              <div class="layui-form-item">
                <div class="layui-input-block">
                  <button class="layui-btn" type="button" onclick='getData_1();'>确认</button>         
                </div>
              </div>
               <!-- 
               <a href="" class="font-set">忘记密码?</a>  
               <a onclick='getData_2()' href="" class="font-set">立即注册</a>
                -->
            </div>
        </form>
    </body>
    <script src="js/JQ.js"></script>
    <script src="js/particle.js"></script>
    <script src="js/login.js"></script>
		<script src="js/loginApp.js"></script>
    <script>

	    var getData_1 = function(){
			var loginNm = document.getElementById("num").value;
	        var pwd = document.getElementById("pswd").value;
	        self.alert("登录名：" + loginNm + "\n密码：" + pwd);
	        
	        $.post("register",{
				number:loginNm,
				passwd:pwd
			},
			function(data,status){
				//alert("\n状态: " + status);
				alert("注册成功");
				window.location.replace("login.html");
			});
		}
    	
	</script>
</html>